<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="/static/component/pear/css/pear.css" />
    <script src="/static/component/layui/layui.js"></script>
    <script src="/static/component/pear/pear.js"></script>
    <style>
    .laytable-cell-1-0-0{  
        height: 100%;
     } 
    .laytable-cell-1-0-1{  
        margin-top: 100px;
        padding-right: 0px;
        padding-left: 0px;
        float: right;
    } 
    .layui-table img { 
        max-width: 185px;
    }
    </style>
</head>
	<body class="pear-container">
		<div class="layui-card">
			<div class="layui-card-body">
				<form class="layui-form" action="">
					<div class="layui-form-item">
                           
               <div class="layui-form-item layui-inline">
                   <label class="layui-form-label">标题</label>
                   <div class="layui-input-inline">
                       <input type="text" name="title" placeholder="" class="layui-input">
                   </div>
               </div>
                        <div class="layui-form-item layui-inline">
                       <button class="pear-btn pear-btn-md pear-btn-primary" lay-submit lay-filter="query">
                           <i class="layui-icon layui-icon-search"></i>
                           查询
                       </button>
                       <button type="reset" class="pear-btn pear-btn-md">
                           <i class="layui-icon layui-icon-refresh"></i>
                           重置
                       </button>
                       </div>
                    </div>
				</form>
			</div>
		</div>
		{if $shifouchaoshi == 0}
        <div class="layui-card">
			<div class="layui-card-body">
				<table id="dataTable" lay-filter="dataTable"></table>
			</div>
		</div>
        {/if}
        {if $shifouchaoshi == 1}
        <div class="layui-card">
			<div class="layui-card-body">
				会员已到期
			</div>
		</div>
        {/if}

		<script type="text/html" id="toolbar">
            {{#  if({$shifouchaogeshu} ==0 ){ }}
            <button class="pear-btn pear-btn-primary pear-btn-md" lay-event="add">
		        <i class="layui-icon layui-icon-add-1"></i>
		        新增投票
			</button>
            {{#  } else { }}
            <button class="pear-btn pear-btn-primary pear-btn-md" lay-event="add1">
		        <i class="layui-icon layui-icon-add-1"></i>
		        新增投票
			</button>
            {{#  } }}
			<!-- <button class="pear-btn pear-btn-danger pear-btn-md" lay-event="batchRemove">
		        <i class="layui-icon layui-icon-delete"></i>
		        删除
		    </button> -->
            <button class="pear-btn pear-btn-md" lay-event="recycle">
		        <i class="layui-icon layui-icon-delete"></i>
		        回收站
		    </button>
		</script>

        

		<script type="text/html" id="options">
            {{#  if(d.numgzh == 1 ){ }}
            <button class="pear-btn pear-btn-primary pear-btn-sm" lay-event="chakanlianjie" style="font-size: 6px !important;width: 60px;padding-right: 0px;padding-left: 0px;">查看链接</button>
            {{#  } else if(d.numgzh == 2 ) { }}
            <button class="pear-btn pear-btn-primary pear-btn-sm" lay-event="chakanlianjie2" style="font-size: 6px !important;width: 60px;padding-right: 0px;padding-left: 0px;">查看链接</button>
            {{#  } else if(d.numgzh == 3 ) { }}
            <button class="pear-btn pear-btn-primary pear-btn-sm" lay-event="chakanlianjie3" style="font-size: 6px !important;width: 60px;padding-right: 0px;padding-left: 0px;">查看链接</button>
            {{#  } else if(d.numgzh == 4 ) { }}
            <button class="pear-btn pear-btn-primary pear-btn-sm" lay-event="chakanlianjie4" style="font-size: 6px !important;width: 60px;padding-right: 0px;padding-left: 0px;">查看链接</button>
            {{#  } else if(d.numgzh == 5 ) { }}
            <button class="pear-btn pear-btn-primary pear-btn-sm" lay-event="chakanlianjie5" style="font-size: 6px !important;width: 60px;padding-right: 0px;padding-left: 0px;">查看链接</button>
            {{#  } }}
            <button class="pear-btn pear-btn-primary pear-btn-sm" lay-event="renyuantongji" style="font-size: 6px !important;width: 60px;padding-right: 0px;padding-left: 0px;">人员统计</button>
            <button class="pear-btn pear-btn-primary pear-btn-sm" lay-event="toupiaofenxi" style="font-size: 6px !important;width: 60px;padding-right: 0px;padding-left: 0px;">投票分析</button>
			<button class="pear-btn pear-btn-primary pear-btn-sm" lay-event="edit" style="font-size: 6px !important;width: 60px;padding-right: 0px;padding-left: 0px;">编辑投票</button>
		    <button class="pear-btn pear-btn-primary pear-btn-sm" lay-event="remove" style="font-size: 6px !important;width: 60px;padding-right: 0px;padding-left: 0px;">删除投票</button>
            <button class="pear-btn pear-btn-primary pear-btn-sm" lay-event="candidate" style="font-size: 6px !important;width: 60px;padding-right: 0px;padding-left: 0px;">候选管理</button>
		</script>
        <script type="text/html" id="typeTpl">
            <div style="margin: 10px;">
                <div style="float: left;">
                    <img style="margin-right: 15px;margin-top: 15px;" width="185" height="104" src='{{d.fmimage}}'>
                </div>
                <div>
                    <p>
                        {{d.id}}.<b>{{d.title}}</b>
                        {{#  if(d.begintime > layui.util.toDateString(Date.parse(new Date()), 'yyyy-MM-dd HH:mm:ss') ){ }}
                        <button type="button" class="pear-btn pear-btn-primary pear-btn-sm" style="border-radius:10px;width: 60px;height: 26px;line-height: 26px;font-size: 6px !important;">未开始</button>
                        {{#  } else if(d.stoptime < layui.util.toDateString(Date.parse(new Date()), 'yyyy-MM-dd HH:mm:ss') ) { }}
                        <button type="button" class="pear-btn pear-btn-primary pear-btn-sm" style="border-radius:10px;width: 60px;height: 26px;line-height: 26px;font-size: 6px !important;">已结束</button>
                        {{#  } else { }}
                        <button type="button" class="pear-btn pear-btn-primary pear-btn-sm" style="border-radius:10px;width: 60px;height: 26px;line-height: 26px;font-size: 6px !important;">进行中</button>
                        {{#  } }}
                        {{#  if(d.zzt ==1 ){ }}
                        <button type="button" class="pear-btn pear-btn-primary pear-btn-sm" style="border-radius:10px;width: 60px;height: 26px;line-height: 26px;font-size: 6px !important;margin-left: 0px;" onclick='state("{{d.id}}")'>暂停</button>
                        {{#  } else { }}
                        <button type="button" class="pear-btn pear-btn-primary pear-btn-sm" style="border-radius:10px;width: 60px;height: 26px;line-height: 26px;font-size: 6px !important;margin-left: 0px;" onclick='state("{{d.id}}")'>开启</button>
                        {{#  } }}
                    </p>
                    <p>活动时间：{{d.begintime}}至{{d.stoptime.slice(5)}}</p>
                    <p>已参加：{{d.zonghouxuan}}人</p>
                    <p>总票数：<span id="numpiao{{d.id}}">{{d.sumpiao}}</span> 点击量：{{d.cat}}</p>
                </div>
            </div>
        </script>
        <script type="text/javascript" src="/static/component/layui_exts/jquery.min.js"></script>
        <script type="text/javascript" src="/static/component/layui_exts/qrcode.js"></script>
        <script>
            function numpiao(){
                $.ajax({
                    url:'{$Request.root}/admin.zavote/numpiao',
                    data:{},
                    dataType: 'json',
                    type: 'POST',
                    success: function(res) {
                        // console.log(res);
                        for (var j = 0; j < res.chazongpiaoshu.length; j++) {
                            $("#numpiao"+res.chazongpiaoshu[j].id).text(res.chazongpiaoshu[j].chazongpiaoshu);
                        }
                    }
                })
            }
            // numpiao();
            function state(id){
                $.ajax({
                    url:'{$Request.root}/admin.zavote/state',
                    data:{id:id},
                    dataType: 'json',
                    type: 'POST',
                    success: function(res) {
                        // console.log(res);
                        window.refresh();
                    }
                })
            }
        </script>
        <script>
        layui.use(['table', 'form', 'jquery','common','laydate'], function() {
            let table = layui.table;
            let form = layui.form;
            let $ = layui.jquery;
            let common = layui.common;
            let laydate = layui.laydate;
            let MODULE_PATH = "{$Request.root}/admin.zavote/";
            let MODULE_PATH2 = "{$Request.root}/admin.zccandidate/";
            let MODULE_PATH3 = "{$Request.root}/admin.zbuserinfo/";
            let MODULE_PATH4 = "{$Request.root}/admin.zdvoter/";
            
            let cols = [
                [
                    {
                        field: "id",
                        unresize: "false",
                        templet:'#typeTpl'
                   }, {
                        toolbar: '#options',
                        unresize: false,
                        align: 'center',
                        width:390,
                    }
                ]
            ]

            table.render({
                elem: '#dataTable',
                url: MODULE_PATH + 'index',
                page: true,
                cols: cols,
                skin: 'line',
                toolbar: '#toolbar',
                defaultToolbar: [{
                    title: '刷新',
                    layEvent: 'refresh',
                    icon: 'layui-icon-refresh',
                }, 'filter', 'print', 'exports'],
                done: function (res, curr, count) {
                    $(this.elem).next().find(".layui-table-header").attr('class',"layui-hide layui-table-header")//当前表格块下找到class为".layui-table-header"的元素（也就是需要隐藏的div）,将其属性改为"layui-hide layui-table-header"即可实现隐藏。（'layui-hide'在layui.css里已经定义好样式）
                }
            });

            table.on('tool(dataTable)', function(obj) {
                if (obj.event === 'remove') {
                    window.remove(obj);
                } else if (obj.event === 'edit') {
                    window.edit(obj);
                } else if (obj.event === 'candidate') {
                    window.candidate(obj);
                } else if (obj.event === 'renyuantongji') {
                    window.renyuantongji(obj);
                } else if (obj.event === 'toupiaofenxi') {
                    window.toupiaofenxi(obj);
                } else if (obj.event === 'chakanlianjie') {
                    window.chakanlianjie(obj);
                } else if (obj.event === 'chakanlianjie2') {
                    window.chakanlianjie2(obj);
                } else if (obj.event === 'chakanlianjie3') {
                    window.chakanlianjie3(obj);
                } else if (obj.event === 'chakanlianjie4') {
                    window.chakanlianjie4(obj);
                } else if (obj.event === 'chakanlianjie5') {
                    window.chakanlianjie5(obj);
                }
            });

            table.on('toolbar(dataTable)', function(obj) {
                if (obj.event === 'add') {
                    window.add();
                } else if (obj.event === 'refresh') {
                    window.refresh();
                } else if (obj.event === 'batchRemove') {
                    window.batchRemove(obj);
                } else if (obj.event === 'recycle') {
                    window.recycle(obj);
                } else if (obj.event === 'add1') {
                    window.add1();
                }
            });

            form.on('submit(query)', function(data) {
                table.reload('dataTable', {
                    where: data.field,
                    page:{curr: 1}
                })
                
                return false;
            });
            
            //弹出窗设置 自己设置弹出百分比
            function screen() {
                if (typeof width !== 'number' || width === 0) {
                width = $(window).width() * 0.8;
                }
                if (typeof height !== 'number' || height === 0) {
                height = $(window).height() - 20;
                }
                return [width + 'px', height + 'px'];
            }

            //弹出窗设置 自己设置弹出百分比
            function screen1() {
                if (typeof width !== 'number' || width === 0) {
                width = $(window).width() * 1;
                }
                if (typeof height !== 'number' || height === 0) {
                height = $(window).height() - 0;
                }
                return [width + 'px', height + 'px'];
            }

            window.add = function() {
                layer.open({
                    type: 2,
                    maxmin: true,
                    title: '新增投票',
                    shade: 0.1,
                    area: screen(),
                    content: MODULE_PATH + 'add'
                });
            }

            window.add1 = function() {
                layer.open({
                    title: '提示',
                    content: '次数已用完'
                });
            }

            window.edit = function(obj) {
                layer.open({
                    type: 2,
                    maxmin: true,
                    title: '修改投票',
                    shade: 0.1,
                    area: screen(),
                    content: MODULE_PATH + 'edit/id/'+obj.data['id']
                });
            }

            window.candidate = function(obj) {
                layer.open({
                    type: 2,
                    maxmin: false,
                    title: '候选管理',
                    shade: 0.1,
                    area: screen1(),
                    content: MODULE_PATH2 + 'index/id/'+obj.data['id'],
                    cancel: function () {
                        table.reload('dataTable');
                    }
                });
            }

            window.renyuantongji = function(obj) {
                layer.open({
                    type: 2,
                    maxmin: false,
                    title: '人员统计',
                    shade: 0.1,
                    area: screen1(),
                    content: MODULE_PATH3 + 'index/id/'+obj.data['id'],
                    cancel: function () {
                        table.reload('dataTable');
                    }
                });
            }

            window.toupiaofenxi = function(obj) {
                layer.open({
                    type: 2,
                    maxmin: false,
                    title: '投票分析',
                    shade: 0.1,
                    area: screen1(),
                    content: MODULE_PATH4 + 'index/id/'+obj.data['id'],
                    cancel: function () {
                        table.reload('dataTable');
                    }
                });
            }
            
            window.chakanlianjie = function(obj) {
                layer.open({
                    type: 0,
                    title: '扫码查看',
                    offset: '50px',
                    content: "<div id='qrcode'></div><br>投票链接：http://utp.xtxcm.com/?id="+obj.data['id']+"&wxid=1",
                });
                new QRCode(document.getElementById('qrcode'), 'http://utp.xtxcm.com/?id='+obj.data['id']+"&wxid=1");
            }

            window.chakanlianjie2 = function(obj) {
                layer.open({
                    type: 0,
                    title: '扫码查看',
                    offset: '50px',
                    content: "<div style='float:left;'><div id='qrcode'></div><br>投票链接：http://utp.xtxcm.com/?id="+obj.data['id']+"&wxid=1</div>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<div style='float:right;'><div id='qrcode2'></div><br>投票链接：http://utp.xtxcm.com/?id="+obj.data['id']+"&wxid=2</div>",
                });
                new QRCode(document.getElementById('qrcode'), 'http://utp.xtxcm.com/?id='+obj.data['id']+"&wxid=1");
                new QRCode(document.getElementById('qrcode2'), 'http://utp.xtxcm.com/?id='+obj.data['id']+"&wxid=2");
            }

            window.chakanlianjie3 = function(obj) {
                layer.open({
                    type: 0,
                    title: '扫码查看',
                    offset: '50px',
                    content: "<div style='float:left;'><div id='qrcode'></div><br>投票链接：http://utp.xtxcm.com/?id="+obj.data['id']+"&wxid=1</div><div style='float:left;'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</div><div style='float:left;'><div id='qrcode2'></div><br>投票链接：http://utp.xtxcm.com/?id="+obj.data['id']+"&wxid=2</div><div style='float:left;'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</div><div style='float:left;'><div id='qrcode3'></div><br>投票链接：http://utp.xtxcm.com/?id="+obj.data['id']+"&wxid=3</div>",
                });
                new QRCode(document.getElementById('qrcode'), 'http://utp.xtxcm.com/?id='+obj.data['id']+"&wxid=1");
                new QRCode(document.getElementById('qrcode2'), 'http://utp.xtxcm.com/?id='+obj.data['id']+"&wxid=2");
                new QRCode(document.getElementById('qrcode3'), 'http://utp.xtxcm.com/?id='+obj.data['id']+"&wxid=3");
            }

            window.chakanlianjie4 = function(obj) {
                layer.open({
                    type: 0,
                    title: '扫码查看',
                    offset: '50px',
                    content: "<div style='float:left;'><div id='qrcode'></div><br>投票链接：http://utp.xtxcm.com/?id="+obj.data['id']+"&wxid=1</div><div style='float:left;'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</div><div style='float:left;'><div id='qrcode2'></div><br>投票链接：http://utp.xtxcm.com/?id="+obj.data['id']+"&wxid=2</div><div style='float:left;'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</div><div style='float:left;'><div id='qrcode3'></div><br>投票链接：http://utp.xtxcm.com/?id="+obj.data['id']+"&wxid=3</div><div style='float:left;'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</div><div style='float:left;'><div id='qrcode4'></div><br>投票链接：http://utp.xtxcm.com/?id="+obj.data['id']+"&wxid=4</div>",
                });
                new QRCode(document.getElementById('qrcode'), 'http://utp.xtxcm.com/?id='+obj.data['id']+"&wxid=1");
                new QRCode(document.getElementById('qrcode2'), 'http://utp.xtxcm.com/?id='+obj.data['id']+"&wxid=2");
                new QRCode(document.getElementById('qrcode3'), 'http://utp.xtxcm.com/?id='+obj.data['id']+"&wxid=3");
                new QRCode(document.getElementById('qrcode4'), 'http://utp.xtxcm.com/?id='+obj.data['id']+"&wxid=4");
            }

            window.chakanlianjie5 = function(obj) {
                layer.open({
                    type: 0,
                    title: '扫码查看',
                    offset: '50px',
                    content: "<div style='float:left;'><div id='qrcode'></div><br>投票链接：http://utp.xtxcm.com/?id="+obj.data['id']+"&wxid=1</div><div style='float:left;'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</div><div style='float:left;'><div id='qrcode2'></div><br>投票链接：http://utp.xtxcm.com/?id="+obj.data['id']+"&wxid=2</div><div style='float:left;'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</div><div style='float:left;'><div id='qrcode3'></div><br>投票链接：http://utp.xtxcm.com/?id="+obj.data['id']+"&wxid=3</div><div style='float:left;'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</div><div style='float:left;'><div id='qrcode4'></div><br>投票链接：http://utp.xtxcm.com/?id="+obj.data['id']+"&wxid=4</div><div style='float:left;'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</div><div style='float:left;'><div id='qrcode5'></div><br>投票链接：http://utp.xtxcm.com/?id="+obj.data['id']+"&wxid=5</div>",
                });
                new QRCode(document.getElementById('qrcode'), 'http://utp.xtxcm.com/?id='+obj.data['id']+"&wxid=1");
                new QRCode(document.getElementById('qrcode2'), 'http://utp.xtxcm.com/?id='+obj.data['id']+"&wxid=2");
                new QRCode(document.getElementById('qrcode3'), 'http://utp.xtxcm.com/?id='+obj.data['id']+"&wxid=3");
                new QRCode(document.getElementById('qrcode4'), 'http://utp.xtxcm.com/?id='+obj.data['id']+"&wxid=4");
                new QRCode(document.getElementById('qrcode5'), 'http://utp.xtxcm.com/?id='+obj.data['id']+"&wxid=5");
            }

            window.recycle = function() {
                layer.open({
                    type: 2,
                    maxmin: true,
                    title: '回收站',
                    shade: 0.1,
                    area: screen(),
                    content: MODULE_PATH + 'recycle',
                    cancel: function () {
                        table.reload('dataTable');
                    }
                });
            }


            window.remove = function(obj) {
                layer.confirm('确定要删除该投票', {
                    icon: 3,
                    title: '提示'
                }, function(index) {
                    layer.close(index);
                    let loading = layer.load();
                    $.ajax({
                        url:MODULE_PATH + 'remove',
                        data:{id:obj.data['id']},
                        dataType: 'json',
                        type: 'POST',
                        success: function(res) {
                            layer.close(loading);
                            //判断有没有权限
                            if(res && res.code==999){
                                layer.msg(res.msg, {
                                    icon: 5,
                                    time: 2000, 
                                })
                                return false;
                            }else if (res.code==200) {
                                layer.msg(res.msg, {
                                    icon: 1,
                                    time: 1000
                                }, function() {
                                    obj.del();
                                });
                            } else {
                                layer.msg(res.msg, {
                                    icon: 2,
                                    time: 1000
                                });
                            }
                        }
                    })
                });
            }

            window.batchRemove = function(obj) {
                let data = table.checkStatus(obj.config.id).data;
                if (data.length === 0) {
                    layer.msg("未选中数据", {
                        icon: 3,
                        time: 1000
                    });
                    return false;
                }
                var ids = []
                var hasCheck = table.checkStatus('dataTable')
                var hasCheckData = hasCheck.data
                if (hasCheckData.length > 0) {
                    $.each(hasCheckData, function (index, element) {
                        ids.push(element.id)
                    })
                }
                layer.confirm('确定要删除这些投票', {
                    icon: 3,
                    title: '提示'
                }, function(index) {
                    layer.close(index);
                    let loading = layer.load();
                    $.ajax({
                        url:MODULE_PATH + 'batchRemove',
                        data:{ids:ids},
                        dataType: 'json',
                        type: 'POST',
                        success: function(res) {
                            layer.close(loading);
                            //判断有没有权限
                            if(res && res.code==999){
                                layer.msg(res.msg, {
                                    icon: 5,
                                    time: 2000, 
                                })
                                return false;
                            }else if (res.code==200) {
                                layer.msg(res.msg, {
                                    icon: 1,
                                    time: 1000
                                }, function() {
                                    table.reload('dataTable');
                                });
                            } else {
                                layer.msg(res.msg, {
                                    icon: 2,
                                    time: 1000
                                });
                            }
                        }
                    })
                });
            }

            window.refresh = function(param) {
                table.reload('dataTable');
            }

            


        })
    </script>
	</body>
</html>
